<template>
<!-- 合作伙伴 -->
  <div class="partner">
      <!-- 合作伙伴 -->
    <div class="partner-work">
        合作伙伴
    </div>
      <div class="no-text" v-if="Partner.length==0">
              <p>暂无团队成员</p>
       </div>
    <!-- 合作伙伴列表 -->
    <div class="partner-list">
        <!-- 每个合作伙伴 -->
        <div class="partner-item" v-for="(item ,index) in Partner" :key="index">
            <dl>
                <dt>
                    <img v-bind:src="item.logo"  v-preview="item.logo" preview-title-enable="false" preview-nav-enable="false"/>
                </dt>
                <dd>
                    <p>{{item.name}}</p>
                    <p>企业官网:<span>{{item.website}}</span></p>
                    <p><span>企业简介:</span>
                    <span v-html="item.info"></span></p>
                </dd>
            </dl>
        </div>
    </div>
  </div>
</template>

<script>
import { GetPartner } from "@/api/zgz";
export default {
  props: {
    id: Number
  },
  data() {
    return {
      Partner: "",
      pageIndex: 1,
      totalPage: 0
    };
  },
  created() {
    this.initialization();
  },
  methods: {
    initialization() {
      this.$indicator.open();
      setTimeout(() => {
        GetPartner(this.id).then(res => {
          if (res.StatusCode === 200) {
            this.Partner = res.Data.PagedList;
            this.totalPage = res.TotalPage;
          }
          this.$indicator.close();
        });
      }, 400);
    }
  }
};
</script>

<style lang="scss" scoped>
// 合作伙伴
.partner {
  .partner-work {
    width: 100%;
    height: 57.6px;
    line-height: 57.6px;
    padding-left: 12px;
    border-bottom: 1px solid #f4f4f4;
    font-size: 14px;
    color: #282828;
    font-weight: bolder;
  }
  // 合作伙伴列表
  .partner-list {
    width: 100%;
    padding: 0 12px;
  }
  //每个合作伙伴
  .partner-item {
    padding-bottom: 23px;
    border-bottom: 1px dashed #cccccc;
    dl {
      overflow: hidden;
      margin-top: 23px;
      > dt {
        float: left;
        width: 53.3px;
        height: 53.3px;
        > img {
          max-height: 100%;
          max-width: 100%;
          vertical-align: midddle;
        }
      }
      > dd {
        float: left;
        margin-left: 10px;
        width: 326.6px;
        > p {
          margin-bottom: 12px;
        }
        > :first-child {
          color: #333333;
          font-size: 14px;
          font-weight: bolder;
        }
        > :nth-child(2) {
          font-size: 12px;
          color: #333333;
          > span {
            color: #3887fe;
            margin-left: 8px;
            text-decoration: underline;
          }
        }
        > :last-child {
          font-size: 10px;
          color: #666666;
          > span {
            color: #333333;
          }
        }
      }
    }
  }
}
</style>
